<template>
  <BasicDrawer
    v-bind="$attrs"
    @register="registerDrawer"
    title="README"
    width="800px"
  >
    <div>
      <MarkdownViewer :value="readmeContent" />
    </div>
  </BasicDrawer>
</template>
  
<script lang="ts" setup>
  import { ref } from 'vue';
  import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
  import { MarkdownViewer } from '@/components/Markdown';

  const readmeContent = ref('');

  const [registerDrawer] = useDrawerInner(async (data) => {
    readmeContent.value = data.record.readme;
  });

</script>